<template>
	<view>
		<Navbar></Navbar>
		<view class="u-m-l-30 u-m-r-30 u-m-t-30">
			<view class="u-m-b-30 u-flex u-row-between">
				<view class="u-font-30 u-font-bold">
					<span class="u-color-darkBlue">我的邀请海报</span>
					<span class="u-color-red">长按海报分享给好友</span>
				</view>
				<view class="invitation_btn" @click="handleGetQrcode">换个样式</view>
			</view>
			<u-image :src="posterData.image" width="100%" border-radius="20" mode="widthFix">
				<u-loading slot="loading"></u-loading>
			</u-image>
		</view>
		<view class="u-m-30">
			<view class="u-m-b-20 u-font-30 u-font-bold u-color-darkBlue">
				<span>我的邀请：</span>
				<span v-if="groupCount > 0">(共{{groupCount}}人)</span>
			</view>
			<GroupBox :list="groupList" @addPerson="addPerson" @callMobile="callMobile" @goDetail="goDetail"></GroupBox>
		</view>
		<Loadmore :status="status"></Loadmore>

		<view style="height: 200rpx;"></view>

		<Bottom :isTwice="true" :rightText="'邀请好友'" @confirm="center" ></Bottom>

		<Modal :show="modal.show" :confirmText="modal.confirm" :modalContent="modal.content"
			:showCancel="modal.showCancel" @confirm="modalConfirm" @cancel="modal.show = false"></Modal>

		<PosterImage :data="posterData" @closePosterImage="posterData.show = false"></PosterImage>
	</view>
</template>

<script>
	import Navbar from '@/components/Navbar.vue'
	import Bottom from '@/components/Bottom.vue'
	import Loadmore from '@/components/Loadmore.vue'
	import PosterImage from '@/components/PosterImage.vue'
	import Modal from '@/components/Modal.vue'
	import GroupBox from '@/components/GroupBox.vue'
	import reachBottom from '@/mixins/reachBottom.js'
	import {
		shareQrcode,
		singleIntegral,
		userInfo,
		businessCardApply
	} from '@/network/api.js'
	import {
		groupList
	} from '@/network/tea.js'
	import {
		call,
		presidentClass,
		PresidentLevel,
    TeaStatus,
	} from '@/utils/index.js'
	export default {
		mixins: [reachBottom],
		components: {
			Navbar,
			Bottom,
			Loadmore,
			PosterImage,
			Modal,
			GroupBox
		},
		data() {
			return {
				user_id: uni.getStorageSync("user_id"),
				invitelist: [],
				posterData: {
					show: false,
					image: '',
					next: 0
				},
				fromUserId: 0,
				/* 弹出提示 */
				modal: {
					show: false,
					showCancel: true,
					confirm: '确定',
					content: ''
				},
				groupList: [],
				groupCount: 0,
				status: 'loadmore'
			}
		},
		onLoad() {
			this.handleGetQrcode()
			this.handleGetInvitelist()
		},
		methods: {
			handleGetInvitelist() {
				const params = {
					user_id: this.user_id,
					is_invite: 1,
					page: this.page,
					limit: this.pageSize
				}
				groupList(params).then(res => {
					if (res.data.list.length > 0) {
						this.groupCount = res.data.count
						res.data.list.map(item => {
							item.president_status = parseInt(item.president_status)
							item.president_name = this.getPresidentName(item.partner_status, item.president_status)
							item.president_class = presidentClass(item.president_status)
							this.groupList.push(item)
						})
					}
					if (res.data.list.length < 10) this.status = 'nomore'
				})
			},
			getPresidentName(status1, status2) {
        return TeaStatus(status1, status2)  
				// return PresidentLevel(status)
			},
			handleGetQrcode() {
				uni.showLoading({
					title:"加载中"
				})
				const params = {
					user_id: uni.getStorageSync("user_id"),
					num: this.posterData.next
				}
				shareQrcode(params).then(res => {
					this.posterData.image = res.data.url
					this.posterData.next = res.data.next
					uni.hideLoading()
				})
			},
			addPerson(id) {
				this.fromUserId = id
				/* const params = {
					key: "ExchangeCards",
					type: 0
				}
				singleIntegral(params).then(res => {
					this.modal.content = `交换名片需要消耗${res.data.value}积分，请问是否仍要继续？`
					this.modal.show = true
				}) */
				this.modal.content = `交换名片，对方同意后交换成功`
				this.modal.show = true
			},
			goDetail(id){
				uni.navigateTo({
					url: "/teaBureau/teaPersonDetail/teaPersonDetail?id=" + id
				})
			},
			modalConfirm() {
				this.modal.show = false
				userInfo({
					user_id: this.user_id
				}).then(res => {
					let integral = res.data.integral // 用户积分
					const params = {
						key: "ExchangeCards",
						type: 0
					}
					singleIntegral(params).then(singleRes => {
						let singleIntegral = singleRes.data.value
						if (parseInt(integral) < parseInt(singleIntegral)) {
							uni.showToast({
								title: "积分不足",
								icon: "none"
							})
						} else {
							const applyParams = {
								user_id: this.user_id,
								from_user_id: this.fromUserId
							}
							businessCardApply(applyParams).then(applyRes => {
								uni.showToast({
									title: `${applyRes.msg}`,
									icON: "none"
								})
							})
						}
					})
				})
			},
			callMobile(val) {
				call(val)
			},
			center(){
				this.posterData.show = true
			},
			right(){
				uni.navigateTo({
					url: "/operate/proxyList/proxyList"
				})
			},
			loadData() {
				if (this.status == 'nomore') return
				this.page++
				this.status = 'loading'
				this.handleGetInvitelist()
			}
		}
	}
</script>

<style scoped>
	.invitation_btn {
		background: #FB6316;
		color: #FFF;
		padding: 10rpx 24rpx;
		font-size: 26rpx;
		border-radius: 10rpx;
	}
</style>